<!DOCTYPE html>
<html xmlns:v-on="http://www.w3.org/1999/xhtml">
<!--页面访问路径 localhost:8888/page/login -->
<!--登录页面登录页面登录页面登录页面登录页面登录页面登录页面登录页面登录页面登录页面登录页面登录页面登录页面登录页面-->
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
    <title>京夕夕商城--登录页面</title>

    <link rel="icon" href="">
    <link rel="stylesheet" type="text/css" href="/css/webbase.css"/>
    <link rel="stylesheet" type="text/css" href="/css/pages-login.css"/>
</head>

<body>
<div class="login-box">
    <!--head-->
    <div class="py-container logoArea">
        <a href="" class="logo"></a>
    </div>
    <!--loginArea-->
    <div class="loginArea" id="loginApp">
        <div class="py-container login">
            <div class="loginform">
                <ul class="sui-nav nav-tabs tab-wraped">
                    <li class="active">
                        <a href="#profile" data-toggle="tab">
                            <h3>账户登录</h3>
                        </a>
                    </li>
                </ul>
                <div class="tab-content tab-wraped">
                    <div id="profile" class="tab-pane  active">
                        <span></span>
                        <form class="sui-form">
                            <p class="msg" style="color: red"></p>
                            <div class="input-prepend"><span class="add-on loginname"></span>
                                <input id="userAccount" type="text" placeholder="邮箱/用户名/手机号" class="span2 input-xfat"
                                    >
                            </div>
                            <div class="input-prepend"><span class="add-on loginpwd"></span>
                                <input id="userPassword"  type="password" placeholder="请输入密码" class="span2 input-xfat"
                                    >
                            </div>
                            <div class="setting">
                                <label class="checkbox inline">
                                    <input name="m1" type="checkbox" value="2" checked="">
                                    自动登录
                                </label>
                                <a href="page/changePassword.html" class="forget">忘记密码？</a>
                            </div>
                            <div class="logined">
                                <a class="sui-btn btn-block btn-xlarge btn-danger" v-on:click="login"
                                   >登&nbsp;&nbsp;录</a>
                            </div>
                        </form>
                        <div class="otherlogin">
                            <div class="types">
                                <ul>
                                    <li><img src="/img/qq.png" width="35px" height="35px"/></li>
                                    <li><img src="/img/sina.png"/></li>
                                    <li><img src="/img/ali.png"/></li>
                                    <li><img src="/img/weixin.png"/></li>
                                </ul>
                            </div>
                            <span class="register"><a href="page/register.html" target="_self">立即注册</a></span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--foot-->

    <script type="text/javascript" src="/js/plugins/jquery/jquery.min.js"></script>
    <!-- 底部栏位 -->
    <!--页面底部版权信息，由js动态加载-->
    <div class="Mod-copyright"></div>
    <script type="text/javascript">$(".Mod-copyright").load("/page/copyright");</script>
    <!--页面底部END-->

</div>

<script type="text/javascript" src="/js/plugins/jquery/jquery.min.js"></script>
<script type="text/javascript" src="/js/plugins/jquery.easing/jquery.easing.min.js"></script>
<script type="text/javascript" src="/js/plugins/sui/sui.min.js"></script>
<script type="text/javascript" src="/js/plugins/jquery-placeholder/jquery.placeholder.min.js"></script>
<script type="text/javascript" src="/js/pages/login.js"></script>
<script type="text/javascript" src="/js/vue/vue.js"></script>
<script type="text/javascript" src="/js/axios.min.js"></script>

</body>
<script src="/js/common.js"></script>
<script>
    var vue = new Vue({
        el:"#loginApp",
        data:{},
        methods:{
            login:function () {
                let	userAccount = $("#userAccount").val();
                let	userPassword = $("#userPassword").val();
                let url = "user/login?userAccount="+userAccount+"&userPassword="+userPassword;
                axios.post(url)
                    .then(function (result) {
                        if (result.data.status==200){
                            window.location.href = "index";
                        }else {
                            $(".msg").html(result.data.msg);
                        }
                    })
                    .catch();
            }
        },
    })
</script>
</html>